﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>QQ音乐10屏带缩略图JS焦点图</title>

<link href="css/foucs.css" rel="stylesheet" />

</head>
<body>

<div class="focus_show" id="imgplay">
	<ul class="focus_pic" id="imglist">
		<li><a href="#"><img src="images/b01.jpg" alt="" width="700" height="320" /></a></li>
		<li><a href="#"><img src="images/b02.jpg" alt="" width="700" height="320" /></a></li>
		<li><a href="#"><img src="images/b03.jpg" alt="" width="700" height="320" /></a></li>
		<li><a href="#"><img src="images/b04.jpg" alt="" width="700" height="320" /></a></li>
		<li><a href="#"><img src="images/b05.jpg" alt="" width="700" height="320" /></a></li>
		<li><a href="#"><img src="images/b06.jpg" alt="" width="700" height="320" /></a></li>
		<li><a href="#"><img src="images/b07.jpg" alt="" width="700" height="320" /></a></li>
		<li><a href="#"><img src="images/b08.jpg" alt="" width="700" height="320" /></a></li>
		<li><a href="#"><img src="images/b09.jpg" alt="" width="700" height="320" /></a></li>
		<li><a href="#"><img src="images/b10.jpg" alt="" width="700" height="320" /></a></li>
	</ul>
	<ul class="focus_title" id="title">
		<li class="current">
			<h3><a href="#">第1张图片的描述信息</a></h3>
			<p></p>
		</li>
	</ul>
	<div class="focus_switch"><a href="javascript:;" class="icon_prev"></a><a href="javascript:;" class="icon_next"></a></div>
	<ul class="focus_list" id="pagelist">
		<li class="current"><a href="#"><img src="images/small01.jpg" alt="第1张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
		<li><a href="#"><img src="images/small02.jpg" alt="第2张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
		<li><a href="#"><img src="images/small03.jpg" alt="第3张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
		<li><a href="#"><img src="images/small04.jpg" alt="第4张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
		<li><a href="#"><img src="images/small05.jpg" alt="第5张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
		<li><a href="#"><img src="images/small06.jpg" alt="第6张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
		<li><a href="#"><img src="images/small07.jpg" alt="第7张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
		<li><a href="#"><img src="images/small08.jpg" alt="第8张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
		<li><a href="#"><img src="images/small09.jpg" alt="第9张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
		<li><a href="#"><img src="images/small10.jpg" alt="第10张图片的描述信息" width="60" height="60" /><span class="border"></span><span class="mask"></span></a></li>
	</ul>
</div>

<script src="js/foucs.js" type="text/javascript"></script>
<script type="text/javascript">
foucsbox(2500);
</script>
<!-- 代码 结束 -->
</body>
</html>
